{extend name="base"/}
 {block name="content"}
 <div id="header-frame">
 {include file="public:top" /}
 <script type='text/javascript' src='__STATIC__/admin/uploadajax/js/jquery-2.0.3.min.js'></script>
<script type='text/javascript' src='__STATIC__/admin/uploadajax/js/jquery.form.js'></script>
<link href="__STATIC__/admin/uploadajax/css/style.css" type="text/css" rel="stylesheet"/>
<link href="__STATIC__/admin/css/banner_index.css" type="text/css" rel="stylesheet"/>

 </div>
 <div id="frame-body">
 <div id="menu-frame" style="width: 100%;float: left;">
 {include file="public:menu" /}
 </div>
 <div id="main-frame" style="float: left;">
 <div id="dcMain" style="margin-left: 20px;width: 1682px;">
   <!-- 当前位置 -->
<div id="urHere">管理中心<b>></b><strong>Banner</strong> </div>   <div id="manager" class="mainBox" style="height:auto!important;height:550px;min-height:550px;">
    <h3><a href="{:url('admin/banner/banner_type')}" class="actionBtn">Banner分类列表</a> |
        <a href="{:url('admin/banner/add_bannertype')}" class="actionBtn">添加Banner分类</a>Banner</h3>

   <h3>
	{foreach name="bannerdata" item="vo"}
   	<a href="{:url('admin/banner/index')}?pid={$vo['banner_id']}" {if condition="$BannerD['banner_id']==$vo['banner_id']"} class="actionBtn" {else /} class="actionBtn" {/if}>{$vo['banner_name']}</a>
   	{/foreach}
    </h3>	
    <style>

    </style>
   	  <table width="100%" border="0" cellpadding="8" cellspacing="0" class="tableBasic">
    <tr>
       <th>添加{$BannerD['banner_name']}轮播图</th>
       <th>{$BannerD['banner_name']}轮播图</th>
     </tr>
     <tr>
      <td align="center" width="350" valign="top">
        <form id='myupload' action="{:url('banner/uploadifyImg')}" method='post' enctype='multipart/form-data'>
        <table width="100%" border="0" cellpadding="8" cellspacing="0" class="tableOnebor">
         <tr>
          <td style="padding-left: 20px;" align="left"><b>首页轮播图名称</b>
			<input type="text" id="bannerm_name" name="bannerm_name" value="" size="20" class="inpMain" />
			<div  class="mask">
                <table width="100%" border="0" cellpadding="8" cellspacing="0" class="tableBasic" _level="1">
                    <tr bgcolor="#FBFBFB" level="1">
                        <th  align="center">分类名称</th>
                    </tr>
                    {foreach name="arr" item="vo"}
                    <tr bgcolor="#FFFFFF" class="1" id="{$vo['protype_id']}">
                        <td  align="left"><img class="addddd" src="__STATIC__/admin/images/menu_plus.gif" _id="0" onclick="rowClicked({$vo['protype_id']}) "/><span>{$vo['protype_name']}</span></td>
                        <td><a onclick="selection(this)">选取</a></td>
                    </tr>
                    {/foreach}
                </table>
     			<a class="hide" onclick="hideMask()">取消</a>
     		</div>
          </td>
         </tr>
         <tr>
             <td  style="padding-left: 20px;" align="left"><b class="show" onclick="showMask()">出现</b><span class="showMaskSpan"></span>
          </td>
         </tr>
		 <tr>
          <td align="center">	
		     <div style="width:500px;margin:10px auto; border:solid 1px #ddd; overflow:hidden; ">
		  <!-- <form id='myupload' action="{:url('banner/uploadImg')}" method='post' enctype='multipart/form-data'> -->
		    <input type="file" id="uploadphoto" name="images" value="请点击上传图片"  style="display:none;" />
		  <!-- </form> -->
		  <div class="imglist"> </div>
		  <input type="hidden" id="bannerm_img" name="bannerm_img" value=""/>
		  <p class="res"></p>
		  <div class="progress">
		    <div class="progress-bar progress-bar-striped" ><span class="percent"></span></div>
		  </div>
		  <a href="javascript:void(0);" onclick="uploadphoto.click()" class="uploadbtn">点击上传首页轮播图</a>
		</td>
		</tr>  
           <tr>
          <td align="left"  style="padding-left: 20px;"><b>排序</b>
			<input type="text" name="bannerm_sort" id="bannerm_sort" value="" size="20" class="inpMain" />
          </td>
         </tr>
         <tr>
          <td align="center">
                      <input type="hidden" name="token" value="79db104d" />
                      <input type="hidden" name="urlRoute" value="carousel/{$BannerD['banner_id']}"/>
                      <input type="hidden" name="banner_id" value="{$BannerD['banner_id']}"/>
                      <input type="hidden" name="action_type" value="" id="action_type"/>
                      <input type="hidden" name="url_action_type" value="" id="url_action_type"/>

			<input type="button" onclick='bannerM_add()' value="提交" class="btn"/>
          </td>
         </tr>
        </table>
  </form> 
      </td>
      <td align="center" valign="top">
       <table width="100%" border="0" cellpadding="8" cellspacing="0" class="tableOnebor">
        <tr>
         <td align="center" width="100">首页轮播图</td>
         <td align="center" width="100">首页轮播图名称</td>
         <td align="center" width="100">链接</td>
            <td width="50" align="center">排序</td>
         <td width="80" align="center">操作</td>
        </tr>
        {foreach name="BannerM" item="vo"}
		                <tr>
         <td align="center"><a href="{$vo['action_url']}" target="_blank"><img src="{$vo['img_url']}"  width="400"  height="240" /></a></td>
         <td align="center">{$vo['bitem_name']}</td>
         <td align="center">{$vo['action_url']}</td>
         <td align="center">{$vo['bitem_sort']}</td>
         <td align="center"><a class="operation-a" href="{:url('admin/banner/edit')}?id={$vo['bitem_id']}">编辑</a> | <a class="operation-a" href="JavaScript:" onclick="bannerm_dele('确定要{$vo['bitem_states']?'下架':'上架'}吗？',{$vo['bitem_id']})">{$vo['bitem_states']?'下架':'上架'}</a></td>
        </tr>
         {/foreach}   	          
                
         </table>
              <h3 align="center">{$BannerM[0]?'':'这里没有数据'}</h3>  
      </td>
     </tr>
    </table>

  
  </div>  
 </div>
  </div>
<script type="text/javascript">
$(document).ready(function(e) {
   var progress = $(".progress"); 
   var progress_bar = $(".progress-bar");
   var percent = $('.percent');
   $("#uploadphoto").change(function(){
     $("#myupload").ajaxSubmit({ 
        dataType:  'json', //数据格式为json 
        beforeSend: function() { //开始上传 
            progress.show();
            var percentVal = '0%';
            progress_bar.width(percentVal);
            percent.html(percentVal);
        }, 
        uploadProgress: function(event, position, total, percentComplete) { 
            var percentVal = percentComplete + '%'; //获得进度 
            progress_bar.width(percentVal); //上传进度条宽度变宽 
            percent.html(percentVal); //显示上传进度百分比 
        }, 
        success: function(data) {
            console.log(data);
            if(data.state == 1){
                var src = data.path;  
                var attstr= '<img src="'+src+'">';

                $(".imglist").append(attstr);
                $("#bannerm_img").val(data.path);
                //$(".res").html("上传图片"+data.name+"成功，图片大小："+data.size+"K,文件地址："+data.url);
            }else{
                $(".res").html(data.errmsg);
            }
            progress.hide();        
        }, 
        error:function(xhr){ //上传失败 
           alert("上传失败"); 
           progress.hide(); 
        } 
    }); 
   });

});

function bannerM_add(){
	var id={$BannerD['banner_id']};
	var success_url="{:url('admin/banner/index')}?pid="+id;
	var url="{:url('admin/banner/add_bannerM')}";
	var admins=$("#myupload").serialize();
	$.post(url,admins,function(result){
	if(result.status=='4')
	{
	dialog.success(result.message,success_url);
	}else
	{
		dialog.error(result.message);
	} 
	})
}
function showMask(){
	$(".mask").show()
}
function hideMask(){
	$(".mask").hide()
}
function bannerm_dele(message, id) {
    layer.open({
        content : message,

        icon:3,
        btn : ['是','否'],
        yes : function(){
            var url="{:url('admin/banner/shelf')}";
            var success_url="{:url('admin/banner/index')}";
            $.post(url,{'id':id},function(result){
                if(result.status=='4')
                {
                    dialog.success(result.message,success_url);
                }else
                {
                    dialog.error(result.message);
                }
            })
        }
    });
}
function rowClicked(id){
//          	var arr=[parseInt($(that).parents("tr").attr("class"))+1];
//              var trArr=$(that).parents("tr").siblings()
//	        		for(var i=1;i<trArr.length;i++){
//	        			arr.push(parseInt(trArr.eq(i).attr("class")))
//	        		}
//              var maxNum=Math.max.apply(null, arr);
    var MaxNum=parseInt($(".tableBasic").attr("_level"));
    var  _id=$("#"+id).children('td').eq(0).children('img').attr("_id");
    var level = parseInt($("#" + id).attr("class")) + 1;
    if(level==2){
        if(_id==0) {
            $("#" + id).children('td').eq(0).children('img').attr("_id", "1");

            $("#" + id).children('td').eq(0).children('img').attr("src", "__STATIC__/admin/images/menu_minus.gif");
            $("#" + id).siblings().remove("."+level);
            for(var j=1;j<=MaxNum;j++){
                if(level==j){
                    var trArr=$("#" + id).siblings();
                    for(var i=0;i<trArr.length;i++){
                        if(parseInt(trArr.eq(i).attr("class"))==level-1){
                            trArr.eq(i).find("img").attr("src","__STATIC__/admin/images/menu_plus.gif")
                            trArr.eq(i).find("img").attr("_id","0")
                        }
                    }
                }
            }
                $.ajax({
                    url: "{:url('admin/product_types/getPareArr')}",
                    type: "post",
                    dataType: "json",
                    data: "id=" + id,
                    success: function (res) {
                        var id = res.id;
                        var data = res.data;
                        //alert(level);
                        console.log(level);
                        if (data == "") {
                        } else {
                            $(data).each(function (k, v) {
                                str = '<tr bgcolor="#FFFFFF" class="' + level + ' tr' + level + '"  id="' + v['protype_id'] + '"><td  style="padding-left:' + level + '0px" align="left"><img  class="addddd" src="__STATIC__/admin/images/menu_plus.gif" _id="0" onclick="rowClicked(' + v['protype_id'] + ')"/><span>' + v['protype_name'] + '</span></td><td><a onclick="selection(this)">选取</a></td>'
                                    + '</tr>';
                                $("#" + id).after(str);
                                $(".tableBasic").attr("_level",level);
                            });
                        }
                    }
                });
        }else
        {
            $("#" + id).children('td').eq(0).children('img').attr("_id", "0");
            $("#" + id).children('td').eq(0).children('img').attr("src", "__STATIC__/admin/images/menu_plus.gif");
            for(var j=1;j<=MaxNum;j++){
                if(level==j){
                    var trArr=$("#" + id).siblings();
                    for(var i=0;i<trArr.length;i++){
                        if(parseInt(trArr.eq(i).attr("class"))>level-1){
                            trArr.eq(i).detach()
                        }
                    }
                }
            }
        }
    }else if(level==3){
        if(_id==0) {
            $("#" + id).children('td').eq(0).children('img').attr("_id", "1");

            $("#" + id).children('td').eq(0).children('img').attr("src", "__STATIC__/admin/images/menu_minus.gif");
            $("#" + id).siblings().remove("."+level);
            for(var j=1;j<=MaxNum;j++){
                if(level==j){
                    var trArr=$("#" + id).siblings();
                    for(var i=0;i<trArr.length;i++){
                        if(parseInt(trArr.eq(i).attr("class"))==level-1){
                            trArr.eq(i).find("img").attr("src","__STATIC__/admin/images/menu_plus.gif")
                            trArr.eq(i).find("img").attr("_id","0")
                        }
                    }
                }
            }
            $.ajax({
                url: "{:url('admin/product/getTypeProducts')}",
                type: "post",
                dataType: "json",
                data: "id=" + id,
                success: function (res) {
                    console.log(res);
                    if (res == "") {
                    } else {
                        $(res).each(function (k, v) {
                            str = '<tr bgcolor="#FFFFFF" class="' + level + ' tr' + level + '"  id="' + v['products_id'] + '"><td  style="padding-left:' + level*2 + '0px" align="left"><span>' + v['products_name'] + '</span></td><td><a onclick="selection(this)">选取</a></td>'
                                + '</tr>';
                            $("#" + id).after(str);
                            $(".tableBasic").attr("_level",level);
                        });
                    }
                }
            });
        }else
        {
            $("#" + id).children('td').eq(0).children('img').attr("_id", "0");
            $("#" + id).children('td').eq(0).children('img').attr("src", "__STATIC__/admin/images/menu_plus.gif");
            for(var j=1;j<=MaxNum;j++){
                if(level==j){
                    var trArr=$("#" + id).siblings();
                    for(var i=0;i<trArr.length;i++){
                        if(parseInt(trArr.eq(i).attr("class"))>level){
                            trArr.eq(i).detach()
                        }
                    }
                }
            }
        }
    }

}
function selection(that){
    var isProductNum=parseInt($(that).parent().parent().attr("class"))
    console.log(isProductNum)
    var isProductNumVal=$(that).parent().prev().find("span").text()
    var id=$(that).parents('tr').attr('id');

    if(isProductNum==3){
        $(".showMaskSpan").text("产品："+isProductNumVal)
        $("#action_type").val('p'+id);
        $("#url_action_type").val("产品："+isProductNumVal);
    }else{
        $(".showMaskSpan").text("分类："+isProductNumVal)
        $("#action_type").val('t'+id);
        $("#url_action_type").val("分类："+isProductNumVal);
    }
    hideMask()
}
</script>
 {/block}